<template>
  <view class="layout layout-column">
    <van-sticky>
      <van-nav-bar
        :placeholder="true"
        title="维修任务"
        left-arrow
        @click-left="back"
      >
      </van-nav-bar>
      <van-search
        v-model="search.equipKeyword"
        placeholder="请输入搜索关键词"
        :show-action="showAction"
        reverse-color
        @search="getListInfo(1)"
        @cancel="onCancel"
        @focus="() => (showAction = true)"
      />
    </van-sticky>

    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
      :immediate-check="false"
    >
      <van-card v-for="item in list" :key="item.id">
        <template #title>
          <div class="title">
            任务单号：{{ item.repairNo }}
            <van-tag
              :type="
                item.status == 9
                  ? 'success'
                  : item.status == 6
                  ? 'warning'
                  : 'primary'
              "
              >{{ item.statusStr }}</van-tag
            >
          </div>
        </template>
        <template #desc>
          <div class="item">
            <span>设备:</span>
            {{ item.equipName
            }}{{ item.equipCode ? `【${item.equipCode}】` : "" }}
          </div>
          <div class="item"><span>所属部门:</span> {{ item.factoryName }}</div>
          <div class="item"><span>紧急度:</span> {{ item.emergency }}</div>
          <div class="item">
            <span>期望解决时间:</span> {{ item.expectedResolutionTime }}
          </div>
        </template>
        <template #footer>
          <van-button
            v-if="item.status === 6"
            @click="onClick(item, 6)"
            type="primary"
            size="small"
            >接收</van-button
          >
          <van-button
            v-if="item.status === 7"
            @click="onClick(item, 7)"
            type="primary"
            size="small"
            >开始</van-button
          >
          <van-button
            v-if="item.status === 8"
            @click="onClick(item, 8)"
            type="primary"
            size="small"
            >报工</van-button
          >
        </template>
      </van-card>
    </van-list>
  </view>
</template>
  
<script>
import { getRepairList, receive, start } from "@/api/home.js";
import { mapMutations } from "vuex";
import { Dialog, Toast } from "vant";
export default {
  data() {
    return {
      loading: false,
      finished: false,
      showAction: false,
      value: "",
      search: {
        equipKeyword: "",
        classifyId: "", // 设备分类主键
        current: 1, //	当前页
        factoryId: "", // 所属部门
        size: 15, // 每页的数量
        column: "",
        orderBy: "desc", // 'desc,asc'
      },
      list: [],
      pages: 0,
      total: 0,
    };
  },
  onShow() {
    this.getListInfo(1);
  },
  mounted() {},
  methods: {
    ...mapMutations(["setDataRow"]),
    /* 获取页面数据 */
    async getListInfo(page) {
      if (page) this.search.current = page;
      if (+page === 1) this.list = [];
      this.loading = true;
      const res = await getRepairList({ ...this.search });
      if (res.code === 200) {
        const list = [];
        res.data.list.filter((item) => {
          list.push(item);
        });
        this.list = this.list.concat(list); // 去重 合并
        const hash = {};
        // 数组去重
        this.list = this.list.reduce((preVal, curVal) => {
          hash[curVal.id]
            ? ""
            : (hash[curVal.id] = true && preVal.push(curVal));
          return preVal;
        }, []);
        this.total = res.data.total;
        this.loading = false;
        if (+this.list.length === +this.total) {
          this.finished = true;
        }
      }
    },
    //   触底加载
    onLoad() {
      if (this.list.length < this.search.current) {
        this.finished = true;
        return;
      }
      if (this.list.length === this.total) {
        this.finished = true;
        return;
      }
      let num;
      num = this.search.current;
      num++;
      this.getListInfo(num);
    },
    back() {
      history.back();
    },
    onClick(item, key) {
      switch (key) {
        case 6:
          Dialog.confirm({
            title: "提示",
            message: "是否确认接收？",
          }).then(async () => {
            await receive(item.id);
            Toast.success("接收成功！");
            this.getListInfo(1);
          });
          break;
        case 7:
          Dialog.confirm({
            title: "提示",
            message: "是否确认开始？",
          }).then(async () => {
            await start(item.id);
            Toast.success("开始成功！");
            this.getListInfo(1);
          });
          break;
        case 8:
          this.setDataRow(item);
          uni.navigateTo({
            url: `./check?id=${item.id}`,
          });
          break;
      }
    },
    onCancel() {
      this.showAction = true;
      this.getListInfo(1);
    },
  },
};
</script>
  
  <style lang="scss" scoped>
</style>
  